import React from 'react';
import { Modal, Icon, Form, Select, Input, message } from 'antd';
import { primaryColor } from '@/defaultSettings';
import { useRequest, defaultFormatResult } from '@/hooks';

import { TERMINATE_TYPE } from '../../dictionary';
import { terminateHire } from '../../service';

const { Option } = Select;
const { TextArea } = Input;

const formItemLayout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 18 }
};

const HireCancelModal = ({ form, visible, setVisible, employId, onConfirm, talentName, ...rest }) => {
    const { getFieldDecorator, validateFields } = form;

    // 沟通提交
    const { loading: submitLoading, run: runSubmit } = useRequest(terminateHire, {
        manual: true,
        ...defaultFormatResult
    });

    const handleOk = () => {
        validateFields(async (errors, values) => {
            if (!errors) {
                const payload = {
                    ...values
                };
                const result = await runSubmit(employId, payload);
                if (result) {
                    message.success('提交成功！');
                    setVisible(false);
                    if (onConfirm) onConfirm();
                }
            }
        });
        setVisible(false);
    };
    const handleCancel = () => {
        setVisible(false);
    };
    return (
        <Modal
            {...rest}
            title="确认终止入职"
            visible={visible}
            onOk={handleOk}
            onCancel={handleCancel}
            okText="确认"
            loading={submitLoading}
            cancelText="取消"
        >
            <p>
                <Icon type="info-circle" theme="filled" style={{ color: primaryColor, margin: '0 6px 0 12px' }} />
                终止候选人{talentName}入职，则将无法办理入职手续
            </p>
            <Form {...formItemLayout}>
                <Form.Item label="原因">
                    {getFieldDecorator('terminationType', {
                        initialValue: TERMINATE_TYPE?.[0]?.value,
                        rules: [
                            {
                                required: true
                            }
                        ]
                    })(
                        <Select>
                            {TERMINATE_TYPE.map(item => (
                                <Option key={item.value} value={item.value}>
                                    {item.text}
                                </Option>
                            ))}
                        </Select>
                    )}
                </Form.Item>
                <Form.Item label="补充说明">
                    {getFieldDecorator('remark')(<TextArea placeholder="请输入终止原因" style={{ height: 140 }} />)}
                </Form.Item>
            </Form>
        </Modal>
    );
};

export default Form.create()(HireCancelModal);
